<include file="Public/head"/>
<link type="text/css" rel="stylesheet" href="{:get_style_cdnurl()}paimai/yunying/plugin/select2/select2.css" />
<style type="text/css">
    .channel{display: block;padding-top: 15px;text-align: right;width: 100%;}
    .channel .addTo {background: #20ab4f none repeat scroll 0 0;border: medium none;border-radius: 3px;color: #fff;height: 26px;line-height: 26px;margin-right: 20px;width: 150px;}
    .channel .channelHover{background: #fff none repeat scroll 0 0;border: 1px solid #20ab4f; border-radius: 4px;display: none;height: 280px;left: 50%;margin: -200px 0 0 -250px;position: fixed;text-align: left;top: 50%;width: 500px; z-index: 99;}
    .channel h4{background: #d6d6d6 none repeat scroll 0 0;border-top-left-radius: 4px;border-top-right-radius: 4px;color: #303030;font-size: 16px;height: 40px;line-height: 40px;padding-left: 10px;}
    .channel label{color: #303030;display: block;font-size: 14px;height: 24px;line-height: 24px;margin: 30px 25px;text-align: left;width: 450px;}
    .channel label span{display:block;float:left;padding: 0 20px;}
    .channel label input{border: 1px solid #e0e0e0;
        /*background: rgba(0, 0, 0, 0) url("http://img1.isou365.cn/paimai/yunying/images/sanjiao.jpg") no-repeat scroll 340px 5px;*/
        cursor: pointer;float: left;height: 22px;line-height: 22px;
        padding-left: 10px;width: 200px;
    }
    .channel .parent_channel_name{display:none;background:none; float: none; margin-left: 14px; width: 236px; padding-left: 4px;}
    .channel .channelBtn{display: block;width: 300px;}
    .channel .channelBtn input{border: 1px solid #20ab4f;border-radius: 4px;color: #20ab4f;height: 30px;line-height: 25px;margin: 0 15px;width: 100px;}
    .channel .channelBtn .channelQue{background: #20ab4f none repeat scroll 0 0;color: #fff;}
    #channel{ border: solid 1px #e0e0e0; width:210px;float:left;padding-left: 10px;height: 24px;background: url('http://img3.isou365.cn/paimai/yunying/images/sanjiao.jpg') no-repeat 185px 5px;}
    #btn-add{width: 66px; height: 24px; line-height: 20px; border: solid 1px #20ab4f; background: #20ab4f; border-radius: 2px; color: #fff; margin-left: 18px; outline: none;padding-left:0px;}
    div.content_wrap{width:100%;}
    div.zTreeDemoBackground{border: 2px solid #eaeaea;text-align: left;height: auto;width:auto;min-width: 450px;max-width:950px;}
    #s2id_channel{width:200px;float:left;padding-right: 8px;}
    /*    .select_model{
        -moz-appearance: none;background: rgba(0, 0, 0, 0) url("http://img3.isou365.cn/paimai/yunying/images/sanjiao.jpg") no-repeat scroll 115px 5px;
        border: 1px solid #d7d7d7;float: left;height: 26px;line-height: 26px;margin-right: 8px;text-indent: 2px;width: 136px;}
*/    .select2-container .select2-choice {
        background: rgba(0, 0, 0, 0) url("http://img1.isou365.cn/paimai/yunying/images/sanjiao.jpg") no-repeat scroll 180px 5px;
        border: 1px solid #d7d7d7;color: #444;display: block; height: 24px;line-height: 24px;overflow: hidden;padding: 0 0 0 8px;position: relative;text-decoration: none;white-space: nowrap;
        width: 190px;}/*
    .text_model{border: 1px solid #d7d7d7;float: left;height: 24px;line-height: 24px;margin: 0 10px 10px 0;text-align: center;width: 150px;}*/
</style>
<script src="{:get_style_cdnurl()}paimai/yunying/plugin/select2/select2.js" type="text/javascript"></script>
<script src="{:get_style_cdnurl()}paimai/yunying/plugin/ztree/jquery.ztree.core-3.5.js" type="text/javascript"></script>
<script src="{:get_style_cdnurl()}paimai/yunying/plugin/ztree/jquery.ztree.exedit-3.5.js" type="text/javascript"></script>
</head>
<include file="Public/common_header"/>
<div class="mian">
    <include file="Public/sidebar" menu="xtgl.qdgl"/>
    <div class="mianR">
        <h3 class="cha">渠道来源管理</h3>
        <div class="channel">
            <if condition="$add_auth eq true">
                <input type="button" value="添加渠道来源" class="addTo">
            </if>
            <div class="channelHover">
                <h4>添加渠道来源</h4>
                <form  id="channel_form" action="/channel/add_channel" method="post">
                    <input type="hidden" name="from_id" id="from_id"/>
                    <input type="hidden" name="pid" id="pid"/>
                    <input type="hidden" name="type" id="type" value="1">
                    <label>
                        <span>一级来源：</span>
                        <input type="text" id="parent_channel_name" name="parent_channel_name" value="">
                        <select name="channel_pid" id="channel">
                            <option value=''>请选择渠道</option>
                            <volist name='pfrom' id='pf'>
                                 <option value="{$pf.from_id}">{$pf.from_name}</option>
                            </volist>
                        </select>
                        <if condition="$new_add_auth eq true">
                            <input type="button" id="btn-add" value="新增">
                        </if>
                    </label>
                    <label><span>二级来源：</span><input type="text" name="channel_name" id="channel_name" class="responsible"></label>
                </form>
                <div class="channelBtn">
                    <input type="button" value="确定" class="channelQue" id="channelDetermine">
                    <input type="button" value="取消" id="channelCancel">
                </div>
            </div>
        </div>
            <div class="content_wrap">
<!--            <div class="tree-search">
                <input type="text" id="search_key" placeholder="部门名称" />
                <input type="button" id="search_btn" value="搜索" />
            </div>-->
            <div class="zTreeDemoBackground left">
                <ul id="tree" class="ztree">
                    
                </ul>
            </div>
        </div>
    </div>
    <div class="clear"></div>
</div>
<script type="text/javascript">
    $("#channel").select2();  
    var setting = {
        view: {
            dblClickExpand: dblClickExpand,
//            addHoverDom: addHoverDom,
//            removeHoverDom: removeHoverDom
            addDiyDom: addDiyDom
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        callback: {
            onClick: zTreeOnClick
        }
    }
    var zNodes =[
        <?php foreach($channel_list as  $item):?>
        {id:<?php echo $item['from_id'];?>, pId:<?php echo $item['pid'];?>, name:"<?php echo $item['from_name'];?>",<?php echo ($item['pid'] == '-3' || $item['pid'] == '-2')? "open: true" : '' ;?>},
        <?php endforeach;?>
    ];
    function addDiyDom(treeId, treeNode) {
        if (treeNode.pId <= -2 || treeNode.pId == 5 || treeNode.pId == 6) return;
        var aObj = $("#" + treeNode.tId + "_a");
        if ($("#diyBtn1_"+treeNode.id).length>0) return;
        if ($("#diyBtn2_"+treeNode.id).length>0) return;
        var editStr = '';
        <if condition="$edit_auth eq true">
            editStr +=  "<a id='diyBtn1_" +treeNode.id+ "' onclick='editNode(\"" + treeNode.tId + "\");return false;' style='margin:2px 0 0 5px;display:none;'>编辑</a>" ;
        </if>
        <if condition="$del_auth eq true">   
            editStr +=  "<a id='diyBtn2_" +treeNode.id+ "' onclick='deleteNode(\"" + treeNode.tId + "\");return false;' style='margin:2px 0 0 5px;display:none;'>删除</a>";
        </if>
        aObj.append(editStr);
    }
    
    function removeHoverDom(treeId, treeNode) {
        if (treeNode.parentNode && treeNode.parentNode.id!=1) return;
        $("#diyBtn1_"+treeNode.id).unbind().remove();
        $("#diyBtn2_"+treeNode.id).unbind().remove();

    }
     function dblClickExpand(treeId, treeNode) {
        return treeNode.level > 0;
    }
    function zTreeOnClick( event, treeId, treeNode){
        $("a:visible[id^='diyBtn']").hide();
        if (treeNode.pId >= 2) { 
            $(".curSelectedNode .node_name").siblings("a[id^='diyBtn']").show();
        };
        $("#pid").val(treeNode.id);
        $("#channel_name").val(treeNode.name);
        $(".deparHover div.zTreeDemoBackground").fadeOut();
    }
    function editNode(tId){
        var treeObj = $.fn.zTree.getZTreeObj("tree");
        var node = treeObj.getNodeByTId(tId);
        $.post("/Channel/get_channel",{"from_id":node.id},function(data){
            if(data.code != 200){
                shibai_alert(data.msg, 1000);
                return false;
            }
            $("#from_id").val(node.id);
             if(data.data.pid == '-2'){ 
                $("#parent_channel_name").val(data.data.from_name).attr('data-id',data.data.pid).attr("readonly",false);
                $("#channel_name").val("");
            }else{
                $("#parent_channel_name").val(data.data.parent_name).attr('data-id',data.data.pid).attr("readonly",true);
                $("#channel_name").val(data.data.from_name);
            }
            $("#parent_channel_name").css("display","block");
            $("#pid").val(data.data.pid);
            $("#channel").hide();
            $("#s2id_channel").hide();
            $("#btn-add").hide();
            $(".channelHover h4").html("编辑渠道来源");
            $("#channel_form").attr("action","/Channel/edit_channel");
            $(".channelHover").fadeIn();
            $(".yunBei").fadeIn();
        },"json");
    }
    
    function deleteNode(tId){
        var treeObj = $.fn.zTree.getZTreeObj("tree");
        var node = treeObj.getNodeByTId(tId);
        if(!confirm("一旦删除无法恢复,是否确认删除渠道来源" + node.name + "?")){
            return false;
        }
        $.post("/Channel/del_channel",{"id":node.id},function(data){
            if(data.code!=200){
                shibai_alert(data.msg, 1000);
                return false;
            }
            //删除成功
            btn_alert('删除成功!',1000);
            treeObj.removeNode(node);
        },"json");
    }
    function showSelect(){
        $("#btn-add").siblings('select').show().siblings('input').hide();
    }
    $(document).ready(function(){
        $.fn.zTree.init($("#tree"), setting, zNodes);
        /**
         * 添加渠道
         */
        $(".channel .addTo").click(function(){
            $(".channelHover h4").html("添加渠道来源");
            $("#parent_channel_name").val("").attr('data-id',"");
            $("#parent_channel_name").css("display","none");
            $("#parent_channel_name").removeAttr("readonly");
            $("#channel_name").val("");
            $("#channel_form").attr("action","/Channel/add_channel");
//            $("#channel").show();
            $("#s2id_channel").show();
            $(".channelHover").fadeIn();
            $(".yunBei").fadeIn();
            $("#btn-add").show();
            $("#type").val('1');
            $("#btn-add").on("click", function(event){
                $(this).siblings('input').show().siblings('select').hide();
                $("#type").val('2');
                $("#s2id_channel").hide();
            });
        });
        /**
        * 
        * @returns {undefined}确定按钮
        */
        $("#channelDetermine").click(function(){
            var postdata = $("#channel_form").serialize();
//            console.log(postdata);
            var _url = $("#channel_form").attr('action');
            $.post(_url, postdata,function(data){
                if(data.code!=200){
                    shibai_alert(data.msg, 800);
                    return false;
                }
                btn_alert(data.msg, 800, function(){
                    window.location.reload();
                });
            },"json");
        });
        /**
        *
        * @param {type} param 取消按钮
        */
       $("#channelCancel").click(function(){
           $(".channelHover").fadeOut();
           $(".yunBei").fadeOut();
//           setTimeout(showSelect(), 500);
       });
    });
    
    
</script>
<include file="Public/foot" />
